import { ref, isRef } from 'vue';
import { ElMessage } from 'element-plus';
import { useForm } from '@/hooks/useForm.js';
import { useTabs } from '@/hooks/useTabs.js';
/**
 * 标签页与表单 结合使用
 * @param {object} _formData 表单对象
 * @param {RefImpl} disabledbtn 按钮可用与不可用
 * @param {function} handleCustomOperation 自定义执行函数（如：用于关闭弹框时的后续操作）
 * @param {RefImpl} formLoading 表单loading状态
 * @param {string or undefined} _activeName 默认的选择的标签页
 * @param {Array<string> or undefined} nameArray 所有的标签页名称信息
 * @returns 
 */
export const useTabsForm = (_formData, disabledbtn, handleCustomOperation, formLoading, _activeName, nameArray) => {

  const { formRef, formData, methodType, isDisabledbtn,
    handleClearData: _handleClearData, submitFormInfo: _submitFormInfo, handleFormValid } = useForm(_formData);

  const { activeName, handleTagsInit,
    setActiveName, handleChangeTabs: _handleChangeTabs } = useTabs(_activeName, nameArray);

  /* 处理切换标签页 */
  function handleChangeTabs (tab, event) {
    /* 清除表单数据：看自己的需求吧，我自己的想法直接清除表单数据的，不然要去管一些状态 */
    handleClearData();
    _handleChangeTabs(tab, event);
  }

  /* 清除表单数据 */
  function handleClearData () {
    _handleClearData();
    handleTagsInit();/* 会返回到最初的标签页 */
    handleCustomOperation && handleCustomOperation();
  }

  /**
   * 表单的保存或编辑
   * @param {string} method 新增与编辑的方法名称
   * @param {function} refreshMethod 刷新表单的方法名称
   * @param {function} handleValidAssignment 额外操作：如自定义校验，数据处理(赋值)
   * handleValidAssignment有3种情况
   * 1.没有传，2.传了，但是没有返回值 undefined，3.传了，返回值是 false 和 true
   */
  const submitForm = (method, refreshMethod, handleValidAssignment) => {
    handleFormValid(handleValidAssignment).then(async () => {
      isRef(disabledbtn) && (disabledbtn.value = true);
      isRef(formLoading) && (formLoading.value = true);
      try {
        const res = await _submitFormInfo(method);
        ElMessage.success(res.msg);
        /* 重新刷新数据 */
        refreshMethod && refreshMethod();
        handleClearData();
      } catch (error) { console.log(error); } finally {
        isRef(disabledbtn) && (disabledbtn.value = false);
        isRef(formLoading) && (formLoading.value = false);
      }
    }).catch((res) => {
      console.log(res);
    });
  }

  return {
    formRef, formData, methodType, isDisabledbtn,

    activeName,
    setActiveName, handleChangeTabs,

    formLoading, submitForm, handleClearData
  }
}
